/* stylelint-disable order/order */
@use 'sass:color';
@use 'sass:list';
@use 'sass:map';
@use 'sass:meta';
@use 'sass:string';

@function is-upper-case($char) {
  @return string.to-lower-case($char) != $char;
}

@function is-lower-case($char) {
  @return string.to-upper-case($char) != $char;
}

@function camel-to-kebab($string) {
  $length: string.length($string);
  $property: '--';

  @for $i from 1 through $length {
    $char: string.slice($string, $i, $i);

    @if is-upper-case($char) {
      $lower-char: string.to-lower-case($char);

      @if $i != 1 {
        $property: '#{$property}-#{$lower-char}';
      } @else {
        $property: '#{$property}#{$lower-char}';
      }
    } @else if $char == '_' {
      $property: '#{$property}-';
    } @else {
      $property: '#{$property}#{$char}';
    }
  }

  @return $property;
}

@function color-is-legal($value) {
  // single color
  @if meta.type-of($value) == color {
    @return true;
  }

  // it’s a valid map color config
  @if (
    (meta.type-of($value) == map) and
      (meta.type-of(map.get($value, 'light')) == color) and
      (meta.type-of(map.get($value, 'dark')) == color)
  ) {
    @return true;
  }

  @warn "Unexpected variable value: getting #{$value}";
  @return false;
}

@function get-color($color, $is-dark: false) {
  @if meta.type-of($color) == color {
    @return $color;
  }

  $light-color: map.get($color, 'light');
  $dark-color: map.get($color, 'dark');

  @if $light-color and $dark-color {
    @return if($is-dark, $dark-color, $light-color);
  }

  @warn "Unexpected color: getting #{$color}";
  @return transparent;
}

@function get-dark-color($color) {
  @return get-color($color, $is-dark: true);
}

@function get-variables($variables) {
  $root-variables: ();
  $dark-variables: ();

  @each $name, $value in $variables {
    $key: camel-to-kebab($name);

    @if string.slice($name, 1, 1) != '_' {
      @if meta.type-of($value) == number or meta.type-of($value) == string {
        $root-variables: map.set($root-variables, $key, $value);
      } @else if color-is-legal($value) {
        $light-color: get-color($value, false);
        $dark-color: get-color($value, true);
        $root-variables: map.set($root-variables, $key, $light-color);

        @if $light-color != $dark-color {
          $dark-variables: map.set(
            $dark-variables,
            $key,
            get-color($value, true)
          );
        }
      }
    }
  }

  @return ('root': $root-variables, 'dark': $dark-variables);
}

@mixin inject-color($key, $config) {
  @if meta.type-of($config) == color {
    :root {
      #{$key}: #{$config};
    }
  } @else {
    $light-color: map.get($config, 'light');
    $dark-color: map.get($config, 'dark');

    @if $light-color and $dark-color {
      :root {
        #{$key}: #{$light-color};
      }

      @if $light-color != $dark-color {
        [data-theme='dark'] {
          #{$key}: #{$dark-color};
        }
      }
    }
  }
}

@mixin inject($variables) {
  $result: get-variables($variables);
  $root-variables: map.get($result, 'root');
  $dark-variables: map.get($result, 'dark');

  :root {
    @each $key, $value in $root-variables {
      #{$key}: #{$value};
    }
  }

  [data-theme='dark'] {
    @each $key, $value in $dark-variables {
      #{$key}: #{$value};
    }
  }
}
